<template>
    <div>
      <div>
        <el-breadcrumb separator-class="el-icon-arrow-right">
          <el-breadcrumb-item :to="{ path: '/index' }">首页</el-breadcrumb-item>
          <el-breadcrumb-item>数据中心</el-breadcrumb-item>
          <el-breadcrumb-item>工序修改</el-breadcrumb-item>
        </el-breadcrumb>
      </div>
      <el-card class="box-card">



      <el-form :model="processForm" :rules="rules" ref="processForm" label-width="100px" class="demo-processForm">
        <el-row>
          <el-col :span="12">
            <el-form-item label="编号" prop="code">
              <el-input v-model="processForm.code" style="width: 200px" disabled="disabled"></el-input>
            </el-form-item>
          </el-col>
            <el-col :span="12">
              <el-form-item label="名称" prop="name">
                <el-input type="text" v-model="processForm.name" style="width: 200px"></el-input>
              </el-form-item>
            </el-col>
        </el-row>
          <el-row>
            <el-col :span="12">

              <el-form-item label="收费方式">
                <el-select v-model="processForm.ctype" placeholder="活动区域">
                  <el-option label="按时间" :value="0"></el-option>
                  <el-option label="按重量" :value="1"></el-option>
                  <el-option label="按面积" :value="2"></el-option>
                </el-select>
              </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="单价" prop="price">
              <el-input type="text" v-model="processForm.price" style="width: 200px"></el-input>
            </el-form-item>
          </el-col>
          </el-row>
        <el-row>
            <el-col :span="12">
              <el-form-item label="准备工时单价" prop="prePrice">
                <el-input type="text" v-model="processForm.prePrice" style="width: 200px"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="工序介绍" prop="remarks">
                <el-input type="text" v-model="processForm.remarks" style="width: 200px"></el-input>
              </el-form-item>
          </el-col>
        </el-row>
        <el-row>
            <el-col :span="12">
              <el-form-item>
                <el-button type="primary" @click="addSave()">保存</el-button>
                <el-button type="primary" @click="logout()">返回</el-button>
              </el-form-item>
          </el-col>
        </el-row>
        </el-form>

      </el-card>

    </div>
</template>

<script>
  export default {
    name: 'AddMaterial',
    data(){
      return{
        processForm:{
          code:'',
          name:'',
          cType:'',
          price:'',
          prePrice:'',
          remarks:''

        },
        rules:{
          name:[{required: true, message: '请输入名称', trigger: 'blur'}],
          cType:[{required: true, message: '请输入收费方式', trigger: 'blur'}],
          price:[
            {required: true, message: '请输入单价', trigger: 'blur'}
          ],
          prePrice:[
            {required: true, message: '请输入准备工时单价', trigger: 'blur'}
          ],
          remarks:[{required: true, message: '请输入工序介绍', trigger: 'blur'}]
        }
      }
    },
    methods:{
      //回显数据
      getById:function (id) {
        this.$http.get("/process/getById/"+id).then((res)=>{
          console.info(id)
          this.processForm=res.data.result;
        });
      },
      //修改数据
      addSave:function () {
        this.$http.post("/process/save",this.processForm).then((res)=>{
          if(res.data.success){
            this.$router.push({ path: "/gx"})
            alert(res.data.message);
          }else{
            alert(res.data.message);
          }
        });
      },
      logout:function () {
        this.$router.push({ path: "/process" });
      }
    },
    mounted() {
      this.getById(this.$route.query.id)
    }
  }
</script>

<style scoped>

</style>
